$(function () {
    var map;
    $.ajax({
        url:'/products/init',
        async:false, //同步
        success:function (data) {
            map = data;
            var s = $('#mb1').render(data)
            $('.productinfo').prepend(s);
        }
    })

    // 颜色 尺码切换  显示对应库存
    $('.productinfo').on('click','.yanse,.chima',function () {
        $(this).addClass('select').parent().siblings().find('a').removeClass('select')

        // 判断是否同时选中 尺码与颜色
        if(  $('.select').length == 2 ){
            // 将选择到的颜色和尺码 放入到表单内
            $('#yanse').val($('.select').eq(0).find('span').text())
            $('#chima').val($('.select').eq(1).text())

            var yanseid = $('.select').eq(0).next().val();
            var chimaid = $('.select').eq(1).next().val();
            $('.kucun').show(); // 显示库存span元素
            // 根据颜色和尺码 显示对应的库存
            var b = false; // 是否找到该库存的标识
            var i;
            for (i = 0; i < map.guiges.length; i++) {
                if( yanseid ==  map.guiges[i].yanseid && chimaid == map.guiges[i].chimaid){
                    b = true;
                    break;
                }
            }
            if(b){
                $('.kucun').text('库存 '+map.guiges[i].kucun+' 件')
                $('.jiage').text(map.guiges[i].price)
                $('.spkc').val(map.guiges[i].kucun)
                // 将购买数量重置为1
                $('.quantity').val(1);
            }else{
                $('.kucun').text('库存 0 件')
                $('.spkc').val(0)
            }
        }
    })
    // 控制商品加减
    $('#jia').click(function () {
        // 先判断是否选择了颜色和库存
        if( $('.select').length == 2 ){
            // 拿到商品库存
            var kc = $('.spkc').val();
            // 要买的数量
            var count = $('.quantity').val();
            if( parseInt(count)+1 <= kc){
                $('.quantity').val(++count);
            }
        }else{
            layer.msg('请选择颜色和库存')
        }
    })

    // 控制商品加减
    $('#jian').click(function () {
        var count = $('.quantity').val();
        if(count > 1){
            $('.quantity').val(--count);
        }
    })

    // 购买效验
    $('.goumai').click(function () {
        // 判断是否选了颜色库存
        if( $('.select').length != 2 ){
            layer.msg('请选择颜色与尺码')
            return;
        }
        // 效验库存数量是否大于0
        if($('.spkc').val()==0){
            layer.msg('该商品数量不足 请更换颜色或尺码')
            return;
        }
        // 发起购买
        $('form').submit();
    })
})